<template>
  <el-dropdown trigger="click">
    <el-avatar :size="40" :src="avatarSrc" shape="square"></el-avatar>
    <template #dropdown>
      <el-dropdown-menu>
        <el-dropdown-item @click="goHome">首页</el-dropdown-item>
        <el-dropdown-item divided @click="handleLogout"
          >退出登录</el-dropdown-item
        >
      </el-dropdown-menu>
    </template>
  </el-dropdown>
</template>

<script setup>
import { getAvatar } from "@/hook/getAvatar.js";
import { useRouter } from "vue-router";

import {useUserStore} from '@/store/user.js'

const router = useRouter();
const { avatarSrc } = getAvatar();

const goHome = () => {
  router.push("/");
};

const userStore = useUserStore()

const handleLogout = () => {
  // console.log("1");
  userStore.logoutFn()
  // router.push('/login')
};
</script>
<style lang="scss" scoped>
</style>